I am using the module "JQuery menu" 6.x-2.3 to display expandable links in the navigation menu with an [+] or [-] icon. This works fine with Drupal's default theme (Garland), but with Pixture Reloaded there are some problems:

As shown in the attached screenshot, IE7 displays a white background after hovering on expandable links. This does not occur with Firefox.

In addition, the bullet in front of non-expandable links disappears (happens with all browsers).

CommentFileSizeAuthor
#4 387972.patch898 bytesroball
white_background_after_hovering_on_expandable_links_with_IE7.jpg71.98 KBroball

Comments

roball’s picture

roball commented

I could fix the second problem with replacing

li.leaf {
  list-style-image: url(bullet-round.png);
}

by

ul li, ul.menu li, li.leaf {
  list-style-image: url(bullet-round.png);
}

within style.css.

roball’s picture

roball commented

I now found that adding

ul.menu li, ul.jquerymenu li.parent {
  background-color: transparent;
  background-image: url(block-tile.png);
}

to style.css fixes the first problem :-)

roball’s picture

roball commented
Title: IE7 does not display JQuery enabled menus propely » Fix to properly display JQuery enabled menus with IE7
roball’s picture

roball commented
Status: Active » Needs review
StatusFileSize
new 387972.patch898 bytes

And here is the patch against HEAD that should fix all the problems mentioned in this report.

rezboom’s picture

rezboom commented

thanks!
just tried the fix for the first problem - white background when hovering over jquery menu items - by appending the suggested CSS to pixture reloaded's style.css but unfortunately, this did not work for me...

an additional note:
the white background problem is also occuring with IE6.

roball’s picture

roball commented

rezboom, did you ensure Optimize CSS files to be Disabled at "Administer -> Site configuration -> Performance" before modifying the .css file? I forgot that in the past, too and this beast of IE didn't respect the modified CSS until I disabled CSS optimization.

rezboom’s picture

rezboom commented

I disabled CSS optimization, but this did not get rid of the problem either. I will report back, if I manage to make it work.
Anyway, thanks for your help!

kenapp’s picture

kenapp commented

Hi,

First time posting, and have this same issue. I edited style.css as outlined in this proposed patch, but the issue of IE7 displaying a white background after hovering on expandable links still exists.

I do have some information to add.

After hovering over the expandable area in a jquery menu and having the background turn white, I notice that the color reverts back to what is specified in the pixture-reloaded theme after I hover over buttons (search, log in) or the superfish menu. I am no programmer, but my guess it that there is some issue with the java script somewhere.

If anyone has resolved this issue, I would love to see it posted here.

Thanks.

vitis’s picture

vitis commented

I have a similar problem.

scoutbaker’s picture

scoutbaker commented

@vitis (#9):

This issue is for the Pixture Reloaded theme. While you may have the same or similar issue, you are using the Acquia Marina theme. If you would like support for that theme, post a request in that theme's issue queue.

dvarney’s picture

dvarney commented
dvarney’s picture

dvarney commented

//
//
//
// BEGIN IE 7 z-index Navigation Fix by: Chepri DJV
// Check for browser version
jQuery.each(jQuery.browser, function(i, val) {
if($.browser.msie && val == '7.0'){
$(function() {
var zIndexNumber = 1000;
$('div').each(function() {
// Apply this fix to only head-top-wrapper's children (doing this prevents the fix from affecting the rest of the page)
if(this.id == 'header-top-wrapper'){
$(this).children().css('zIndex', zIndexNumber);
zIndexNumber -= 10;
}
});
});
}
});
// END IE 7 z-index Navigation Fix by: Chepri DJV
//
//
//

Jeff Burnz’s picture

Jeff Burnz commented
Status: Needs review » Closed (fixed)

This must be fixed by now, surely...